<template>
  <el-card>
    <h2>查询管理员信息</h2>
    <el-form :inline="true" :model="searchForm" style="margin-bottom: 20px;">
      <el-form-item label="管理员姓名">
        <el-input v-model="searchForm.adminName" placeholder="请输入管理员姓名" clearable />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handleSearch">查询</el-button>
        <el-button @click="resetSearch">重置</el-button>
      </el-form-item>
    </el-form>

    <el-table v-if="adminInfo.length" :data="adminInfo" style="margin-top: 20px; width: 100%">
      <el-table-column prop="adminId" label="管理员ID" width="120" />
      <el-table-column prop="name" label="姓名" />
      <el-table-column prop="email" label="邮箱" />
      <el-table-column prop="phone" label="电话" />
      <el-table-column label="级别">
        <template #default="scope">
          {{ levelLabel(scope.row.level) }}
        </template>
      </el-table-column>
    </el-table>
    <div v-else style="margin-top: 20px; color: #888;">暂无管理员信息</div>
  </el-card>
</template>

<script setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import axios from 'axios'

const operatorId = localStorage.getItem('loginId')
const searchForm = ref({
  adminName: ''
})
const adminInfo = ref([])

const levelLabel = (level) => {
  if (level === 1) return 'A'
  if (level === 2) return 'B'
  if (level === 3) return 'C'
  return level
}

const handleSearch = async () => {
  if (!searchForm.value.adminName) {
    ElMessage.error('请输入管理员姓名')
    return
  }
  try {
    const res = await axios.get(
      `http://localhost:8080/student/${operatorId}/${searchForm.value.adminName}/getAdminByName`
    )
    if (res.data && res.data.code === 200 && Array.isArray(res.data.data)) {
      adminInfo.value = res.data.data
    } else {
      adminInfo.value = []
      ElMessage.error(res.data && res.data.msg ? res.data.msg : '未查询到该管理员')
    }
  } catch (e) {
    adminInfo.value = []
    ElMessage.error('查询失败')
  }
}

const resetSearch = () => {
  searchForm.value.adminName = ''
  adminInfo.value = []
}
</script>